<template>
	<div v-loading="loading">
		<div class="content-top">
			<span class="h1">项目管理</span>
			<span class="h2">补偿标准</span>
			<el-button type="primary" @click="fnAddTip()">添加</el-button>
		</div>
		<div class="content">
			<div class="title clearfix">
				<div class="fl">
					<label for="">定义类型:</label>
					<el-select v-model="DefinType" filterable placeholder="请选择" clearable @change='chane'>
						<el-option v-for="item in DefinTypeS" :key="item.ID" :label="item.Name" :value="item.ID">
						</el-option>
					</el-select>
					<label for="">征收项目:</label>
					<el-select v-model="project" filterable placeholder="请选择">
						<el-option v-for="item in options" :key="item.ID" :label="item.Name" :value="item.ID">
						</el-option>
					</el-select>
					<label for="">工程项目:</label>
					<el-select v-model="project1" filterable placeholder="请选择" @change='chang2()'>
						<el-option v-for="item in gczmList" :key="item.ID" :label="item.Name" :value="item.ID">
						</el-option>
					</el-select>
					<span style="margin-left: 20px;">行政区域:</span>
					<el-cascader clearable :options="regions" filterable v-model="region" separator='-' change-on-select @change='cascader1()'></el-cascader>
				</div>
				<div class="fr">
					<el-input v-model="search" placeholder="请输入项目名" style="width:217px;"></el-input>
					<el-button type="primary" @click='searchs()'>查询</el-button>
				</div>
			</div>
			<el-table :data="tableData" border style="width: 100%">
				<el-table-column prop="ID" label="导入ID">
				</el-table-column>
				<el-table-column prop="ProjectStr" label="工程项目" show-overflow-tooltip>
				</el-table-column>
				<el-table-column prop="LevyStr" label="征收项目名称" show-overflow-tooltip>
				</el-table-column>
				<el-table-column prop="RegionStr" label="行政区域" show-overflow-tooltip>
				</el-table-column>
				<el-table-column prop="Name" label="规格" show-overflow-tooltip>
				</el-table-column>
				<el-table-column prop="Unit" label="计算单位">
				</el-table-column>
				<el-table-column prop="StandardPrice" label="补偿标准(元/单位)">
				</el-table-column>
				<el-table-column prop="SmallPrice" label="零星补偿标准(元/单位)">
				</el-table-column>
				<el-table-column prop="PlusPrice" label="超密度补偿标准(元/单位)">
				</el-table-column>
				<el-table-column prop="SRange" label="范围最小值">
				</el-table-column>
				<el-table-column prop="ERange" label="范围最大值">
				</el-table-column>
				<el-table-column prop="StatrStr" label="状态">
				</el-table-column>
				<el-table-column label="操作" width="100">
					<template slot-scope="scope">
						<el-dropdown trigger="click">
							<el-button type="primary">
								操作<i class="el-icon-arrow-down el-icon--right"></i>
							</el-button>
							<el-dropdown-menu slot="dropdown">
								<el-dropdown-item>
									<el-button type="success" size="small" @click="fnEdit(scope.row.Unit,scope.row.ID,scope.row.ProjectID,scope.row.LevyItemID,scope.row.RegionID,scope.row.Name,scope.row.IsSingle,scope.row.StandardPrice,scope.row.SmallPrice,scope.row.PlusPrice,scope.row.SRange,scope.row.ERange)">修改</el-button>
								</el-dropdown-item>
								<el-dropdown-item>
									<el-button type="danger" size="small" @click="fnDel(scope.row.ID)">删除</el-button>
								</el-dropdown-item>
							</el-dropdown-menu>
						</el-dropdown>
					</template>
				</el-table-column>
			</el-table>
			<div class="pages">
				<el-pagination small :current-page="pages" @current-change="handleCurrentChange" layout="prev, pager, next" :total="total" background>
				</el-pagination>
			</div>
		</div>
		<div class="add">
			<el-dialog title="添加" :visible.sync="addTip" width="550px">
				<div class="adduserinfo">
					<el-form ref="form" label-width="200px">
						<el-form-item label="工程项目">
							<el-select v-model="form.gcxm" filterable placeholder="请选择工程项目" @change='chang1()'>
								<el-option v-for="item in gczmList" :key="item.ID" :label="item.Name" :value="item.ID">
								</el-option>
							</el-select>
						</el-form-item>
						<el-form-item label="定义类型">
							<el-select v-model="DefinType6" filterable placeholder="请选择" clearable @change='chane6'>
								<el-option v-for="item in DefinTypeS" :key="item.ID" :label="item.Name" :value="item.ID">
								</el-option>
							</el-select>
						</el-form-item>
						<el-form-item label="征收项目名称">
							<el-select v-model="form.zsxm" filterable placeholder="请选择">
								<el-option v-for="item in options6" :key="item.ID" :label="item.Name" :value="item.ID">
								</el-option>
							</el-select>
							<!--<el-select v-model="form.zsxm" filterable placeholder="请选择征收项目">
								<el-option v-for="item in options1" :key="item.ID" :label="item.Name" :value="item.ID">
								</el-option>
							</el-select>-->
						</el-form-item>
						<el-form-item label="行政区域">
							<el-tree :data="regions" :check-strictly='true' show-checkbox  node-key="value" ref="tree" highlight-current :props="defaultProps" @check-change="handleCheckChange">
							</el-tree>
							<!--<el-cascader :options="regions" separator='-' filterable v-model="form.region" change-on-select @change='cascader()'></el-cascader>-->
						</el-form-item>
						<el-form-item label="规格">
							<el-input v-model="form.name" placeholder="请输入规格"></el-input>
						</el-form-item>
						<el-form-item label="计算单位" style='color: red !important;' class='el-item'>
							<el-input v-model="form.Unit" placeholder="请输入计算单位"></el-input>
						</el-form-item>
						<el-form-item label="是否单一标准">
							<el-checkbox label="单一标准" v-model="form.checked" @change="fnChange()"></el-checkbox>
						</el-form-item>
						<el-form-item label="补偿标准" style='color: red !important;' class='el-item'>
							<el-input v-model="form.lxbz" placeholder="请输入补偿标准"></el-input>
						</el-form-item>
						<el-form-item label="零星补偿标准(元/株)(单位)" style='color: dodgerblue !important;' class='el-items'>
							<el-input v-model="form.cmbz" placeholder="请输入零星补偿标准"></el-input>
						</el-form-item>

						<el-form-item label="超密度补偿标准(元/株)(单位)" style='color: dodgerblue !important;' class='el-items'>
							<el-input v-model="form.bzz" placeholder="请输入超密度补偿标准"></el-input>
						</el-form-item>
						<el-form-item label="大于" v-show="isShow" style='color: dodgerblue !important;' class='el-items'>
							<el-input v-model="form.min" placeholder="请输入最小值"></el-input>
							<el-tooltip class="item" effect="dark" content="如果标准是范围，范围最小值" placement="bottom-start">
								<span class="prompt">?</span>
							</el-tooltip>
						</el-form-item>
						<el-form-item label="小于等于" v-show="isShow" style='color: dodgerblue !important;' class='el-items'>
							<el-input v-model="form.max" placeholder="请输入最大值"></el-input>
							<el-tooltip class="item" effect="dark" content="如果标准是范围，范围最大值" placement="bottom-start">
								<span class="prompt">?</span>
							</el-tooltip>
						</el-form-item>
					</el-form>
				</div>
				<span slot="footer" class="dialog-footer">
            <el-button @click="addTip = false">取 消</el-button>
            <el-button type="primary" @click="subAdd()">确 定</el-button>
        </span>
			</el-dialog>
		</div>
		<div class="edit">
			<el-dialog title="修改" :visible.sync="editTip" width="550px">
				<div class="adduserinfo">
					<el-form ref="form" label-width="200px">
						<el-form-item label="工程项目">
							<el-select v-model="form.gcxm" filterable placeholder="请选择工程项目" @change='chang3()'>
								<el-option v-for="item in gczmList" :key="item.ID" :label="item.Name" :value="item.ID">
								</el-option>
							</el-select>
						</el-form-item>
						<el-form-item label="征收项目">
							<el-select v-model="form.zsxm" filterable placeholder="请选择征收项目">
								<el-option v-for="item in options1" :key="item.ID" :label="item.Name" :value="item.ID">
								</el-option>
							</el-select>
						</el-form-item>
						<el-form-item label="行政区域">
							<el-cascader :options="regions" separator='-' filterable v-model="form.region" change-on-select @change='cascader()'></el-cascader>
						</el-form-item>
						<el-form-item label="规格">
							<el-input v-model="form.name" placeholder="请输入规格"></el-input>
						</el-form-item>
						<el-form-item label="计算单位" style='color: red !important;' class='el-item'>
							<el-input v-model="form.Unit" placeholder="请输入计算单位"></el-input>
						</el-form-item>
						<el-form-item label="是否单一标准">
							<el-checkbox label="单一标准" v-model="form.checked" @change="fnChange()"></el-checkbox>
						</el-form-item>
						<el-form-item label="补偿标准" style='color: red !important;' class='el-item'>
							<el-input v-model="form.lxbz" placeholder="请输入补偿标准"></el-input>
						</el-form-item>
						<el-form-item label="零星补偿标准(元/株)(单位)" style='color: dodgerblue !important;' class='el-items'>
							<el-input v-model="form.cmbz" placeholder="请输入零星补偿标准"></el-input>
						</el-form-item>

						<el-form-item label="超密度补偿标准(元/株)(单位)" style='color: dodgerblue !important;' class='el-items'>
							<el-input v-model="form.bzz" placeholder="请输入超密度补偿标准"></el-input>
						</el-form-item>
						<el-form-item label="大于" v-show="isShow" style='color: dodgerblue !important;' class='el-items'>
							<el-input v-model="form.min" placeholder="请输入最小值"></el-input>
							<el-tooltip class="item" effect="dark" content="如果标准是范围，范围最小值" placement="bottom-start">
								<span class="prompt">?</span>
							</el-tooltip>
						</el-form-item>
						<el-form-item label="小于等于" v-show="isShow" style='color: dodgerblue !important;' class='el-items'>
							<el-input v-model="form.max" placeholder="请输入最大值"></el-input>
							<el-tooltip class="item" effect="dark" content="如果标准是范围，范围最大值" placement="bottom-start">
								<span class="prompt">?</span>
							</el-tooltip>
						</el-form-item>
					</el-form>
				</div>
				<span slot="footer" class="dialog-footer">
            <el-button @click="editTip = false">取 消</el-button>
            <el-button type="primary" @click="subEdit()">确 定</el-button>
        </span>
			</el-dialog>
		</div>
	</div>
</template>
<script>
	import api from "../../axios/api";
	export default {
		name: "projectStardard",
		data() {
			return {
				region: [],
				loading: false,
				pages: 1, //页码
				total: 1, //总条数
				project1: "", //工程id
				addTip: false,
				editTip: false,
				isShow: true,
				search: "",
				index: "",
				tableData: [], //补偿列表
				options: [], //征收项目
				gczmList: [], //工程项目
				regions: [], //行政区域
				RegionID: "", //行政区域id
				project: "", //征收id
				form: {
					Unit: "",
					name: "",
					gcxm: "",
					zsxm: "",
					region: [],
					lxbz: "",
					cmbz: "",
					bzz: "",
					min: "",
					max: "",
					checked: false
				},
				id: "", //公共id
				DefinType: '',
				DefinT: '',
				options1: [],
				options6: [],
				DefinType6: '',
				defaultProps: {
		          children: 'children',
		          label: 'label'
		       },
				DefinTypeS: [{
						value: 0,
						label: "全部"
					},
					{
						value: 1,
						label: "土地征收"
					},
					{
						value: 2,
						label: "林木征收"
					},
					{
						value: 3,
						label: "房屋主体"
					},
					{
						value: 4,
						label: "房屋装修"
					},
					{
						value: 5,
						label: "坟山迁移"
					},
					{
						value: 6,
						label: "特殊征拆"
					}
				]
			};
		},
		created() {
			this.getlistlb()
			this.getlistzfAdd()
			//  this.getlistzf();
			this.zList();

		},
		methods: {
			handleCheckChange(data, checked, indeterminate) {
	            this.form.region = this.$refs.tree.getCheckedKeys();
	            console.log(this.form.region)
	        },
			//搜索
			searchs() {
				this.loading = true;
				this.pages = 1;
				this.DefinT = ''
				for(var i = 0; i < this.DefinTypeS.length; i++) {
					if(this.DefinType == this.DefinTypeS[i].ID) {
						this.DefinT = this.DefinTypeS[i].DefineID
					}
				}
				this.$post(api.comList, {
						Para: {
							LevyItemID: this.project,
							ProjectID: this.project1,
							QueryKeyWord: this.search,
							RegionID: this.RegionID,
							Defined: this.DefinT
						},
						PageSize: 10,
						PageIndex: this.pages - 1,
						OrderString: "",
						ToExcel: false
					})
					.then(response => {
//						this.RegionID = ''
						if(response.isOK == true && response.state == 200) {
							this.loading = false;
							this.tableData = response.Data.Data;
							this.total = response.Data.Items ? response.Data.Items : 1;
						} else {
							this.loading = false;
							this.tableData = []
							this.$message.error(response.msg);
						}
					})
					.catch(err => {
						this.loading = false;
					});
			},
			//搜索计算
			cascader1() {
				this.RegionID = "";
				this.RegionID = this.region[this.region.length - 1];
			},
			chane() {
				this.getlistzf(this.DefinType)
			},
			chane6() {
				console.log(this.DefinType6)
				this.getlistzf1(this.DefinType6)
			},
			//获取征收类别
			getlistlb() {
				this.$get(api.getlistlb).then((response) => {
					if(response.statusText == 'OK' && response.status == 200) {
						this.DefinTypeS = response.data
					} else {
						this.$message.error(response.statusText);
					}
				}).catch((err) => {
					this.loading = false;
				})
			},
			//添加时获取
			getlistzfAdd() {
				this.$get(api.getlistzf)
					.then(response => {
						if(response.statusText == "OK" && response.status == 200) {
							this.options1 = response.data;
						} else {
							this.$message.error(response.statusText);
						}
					})
					.catch(err => {
						this.loading = false;
					});
			},
			//获取征收项目
			getlistzf(types) {
				this.options = []
				this.project = ''
				this.$get(api.getlistzfde + '/' + types)
					.then(response => {
						if(response.statusText == "OK" && response.status == 200) {
							this.options = response.data;
						} else {
							this.$message.error(response.statusText);
						}
					})
					.catch(err => {
						this.loading = false;
					});
			},
			//获取征收项目
			getlistzf1(types) {
				this.options6 = []
				this.form.zsxm = ''
				this.$get(api.getlistzfde + '/' + types)
					.then(response => {
						if(response.statusText == "OK" && response.status == 200) {
							this.options6 = response.data;
						} else {
							this.$message.error(response.statusText);
						}
					})
					.catch(err => {
						this.loading = false;
					});
			},
			//获取工程项目
			zList() {
				this.$post(api.getlistde).then(response => {
					if(response.isOK == true && response.state == 200) {
						this.gczmList = response.Data;
						this.project1 = response.Data[0].ID
						this.form.gcxm = this.gczmList[0] ? this.gczmList[0].ID : "";
						this.comList();
						this.anonymousget(this.project1);
						
					} else {
						this.$message.error(response.msg);
					}
				}).catch((error) => {
					this.loading = false;
				})
			},
			//获取行政区域
			anonymousget(idt) {
				this.$get(api.anonymousget + "/" + idt).then(response => {
					if(response.data.isOK == true && response.data.state == 200) {
						for(var i = 0; i < response.data.Data.length; i++) {
							this.regions.push({
								label: response.data.Data[i].RegionName,
								value: response.data.Data[i].ID,
								checked: false,
								ParentID: response.data.Data[i].ParentID
							});
						}
						this.regions = this.$toTree(this.regions);

					} else {
						this.$message.error(response.data.msg);
					}
				});
			},
			chang1() {
				this.regions = [];
				this.form.region = [];
				if(this.form.gcxm) {
					this.anonymousget(this.form.gcxm);
				}
			},
			chang2() {
				this.regions = [];
				this.region = [];
				if(this.project1) {
					this.anonymousget(this.project1);
				}
			},
			chang3() {
				this.regions = [];
				if(this.form.gcxm) {
					this.anonymousget(this.form.gcxm);
				}
			},
			//获取提交的行政区域id
			cascader() {
				this.RegionID = "";
				this.RegionID = this.form.region[this.form.region.length - 1];
			},
			//分页
			handleCurrentChange(val) {
				this.loading = true;
				this.pages = val;
				this.DefinT = ''
				for(var i = 0; i < this.DefinTypeS.length; i++) {
					if(this.DefinType == this.DefinTypeS[i].ID) {
						this.DefinT = this.DefinTypeS[i].DefineID
					}
				}
				this.$post(api.comList, {
						Para: {
							LevyItemID: this.project,
							ProjectID: this.project1,
							QueryKeyWord: this.search,
							RegionID: this.region[this.region.length - 1],
							Defined: this.DefinT
						},
						PageSize: 10,
						PageIndex: this.pages - 1,
						OrderString: "",
						ToExcel: false
					})
					.then(response => {
						if(response.isOK == true && response.state == 200) {
							this.loading = false;
							this.tableData = response.Data.Data;
							this.total = response.Data.Items ? response.Data.Items : 1;
						} else {
							this.loading = false;
							this.tableData = []
							this.$message.error(response.msg);
						}
					})
					.catch(err => {
						this.loading = false;
					});
			},
			//获取补偿标准列表
			comList() {
				this.loading = true;
				this.$post(api.comList, {
						Para: {
							LevyItemID: "",
							ProjectID: this.project1,
							QueryKeyWord: "",
							RegionID: "",
							Defined: this.DefinType
						},
						PageSize: 10,
						PageIndex: this.pages - 1,
						OrderString: "",
						ToExcel: false
					})
					.then(response => {
						if(response.isOK == true && response.state == 200) {
							this.loading = false;
							this.tableData = response.Data.Data;
							this.total = response.Data.Items ? response.Data.Items : 1;

						} else {
							this.loading = false;
							this.tableData = []
							this.$message.error(response.msg);
						}
					})
					.catch(err => {
						this.loading = false;
					});
			},
			//打开添加弹窗
			fnAddTip() {
				this.form.gcxm = this.form.gcxm ? this.form.gcxm : ''
				this.chang1()
				this.form.name = "";
				this.form.zsxm = "";
				this.form.bzz = "";
				this.form.lxbz = "";
				this.form.cmbz = "";
				this.form.min = "";
				this.form.max = "";
				this.form.Unit = "";
				this.DefinType6 = ''
				this.form.region = [];
				this.form.checked = false;
				this.isShow = true;
				this.addTip = true;
			},
			//提交添加
			subAdd() {
				if(
					this.form.Unit == "" ||
					this.form.gcxm == "" ||
					this.form.zsxm == "" ||
					this.form.region == "" ||
					this.form.name == "" ||
					this.form.lxbz == "" ||
					this.form.cmbz == "" ||
					this.form.bzz == ""
				) {
					this.$message({
						message: "参数不能为空",
						type: "warning"
					});
					return;
				}
				if(!this.form.checked) {
					if(this.form.min == "" || this.form.max == "") {
						this.$message({
							message: "标准不能为空",
							type: "warning"
						});
						return;
					}
				}
				this.loading = true;
				this.addTip = false;
				this.$post(api.comAdd, {
						ProjectID: this.form.gcxm,
						LevyItemID: this.form.zsxm,
						RegionID: this.form.region,
						Name: this.form.name,
						IsSingle: this.form.checked,
						StandardPrice: this.form.lxbz,
						SmallPrice: this.form.cmbz,
						PlusPrice: this.form.bzz,
						SRange: this.form.min,
						ERange: this.form.max,
						Unit: this.form.Unit
					})
					.then(response => {
						console.log(response);
						if(response.isOK == true && response.state == 200) {
							localStorage.gcxm = this.form.gcxm
							this.loading = false;
							this.pages = 1;
							this.comList();
							this.$message({
								message: "添加成功",
								type: "success"
							});
						} else {
							this.loading = false;
							this.$message.error(response.msg);
						}
					})
					.catch(err => {
						this.loading = false;
					});
			},
			//修改
			fnEdit(
				Unit,
				id,
				ProjectID,
				LevyItemID,
				RegionID,
				Name,
				IsSingle,
				StandardPrice,
				SmallPrice,
				PlusPrice,
				SRange,
				ERange
			) {
				this.id = id;
				this.form.Unit = Unit;
				this.form.gcxm = ProjectID;
				//    this.chang1();
				this.form.zsxm = LevyItemID;
				this.RegionID = RegionID;
				this.anonychildby(RegionID);
				this.form.name = Name;
				this.isShow = !IsSingle;
				this.form.checked = IsSingle;
				this.form.lxbz = StandardPrice;
				this.form.cmbz = SmallPrice;
				this.form.bzz = PlusPrice;
				this.form.min = SRange;
				this.form.max = ERange;
				this.editTip = true;
			},
			anonychildby(id) {
				this.form.region = [];
				this.$get(api.anonychildby + "/" + id).then(response => {
					if(response.data.isOK == true && response.data.state == 200) {
						if(!response.data.Data) {
							this.form.region.push(id);
							return false;
						}
						for(let i = response.data.Data.length - 1; i >= 0; i--) {
							this.form.region.push(response.data.Data[i].ID);
						}
						this.form.region.push(id);
					}
				});
			},
			//提交修改
			subEdit() {
				if(
					this.form.Unit == "" ||
					this.form.lxbz == "" ||
					this.RegionID == "" ||
					this.form.gcxm == "" ||
					this.form.zsxm == "" ||
					this.form.region == "" ||
					this.form.name == ""
				) {
					this.$message({
						message: "参数不能为空",
						type: "warning"
					});
					return;
				}
				if(!this.form.checked) {
					if(this.form.min == "" || this.form.max == "") {
						this.$message({
							message: "标准不能为空",
							type: "warning"
						});
						return;
					}
				}
				this.loading = true;
				this.editTip = false;
				this.$post(api.comUpdate, {
						Id: this.id,
						ProjectID: this.form.gcxm,
						LevyItemID: this.form.zsxm,
						RegionID: this.RegionID,
						Name: this.form.name,
						IsSingle: this.form.checked,
						StandardPrice: this.form.lxbz,
						SmallPrice: this.form.cmbz,
						PlusPrice: this.form.bzz,
						SRange: this.form.min,
						ERange: this.form.max,
						Unit: this.form.Unit
					})
					.then(response => {
						if(response.isOK == true && response.state == 200) {
							this.pages = 1;
							this.comList();
							this.$message({
								message: "修改成功",
								type: "success"
							});
						} else {
							this.loading = false;
							this.$message.error(response.msg);
						}
					})
					.catch(err => {
						this.loading = false;
					});
			},
			//删除列表
			fnDel(id) {
				this.$confirm("将永久删除该条数据, 是否继续?", "提示", {
						confirmButtonText: "确定",
						cancelButtonText: "取消",
						type: "warning"
					})
					.then(() => {
						this.loading = true;
						this.$get(api.comDel + "/" + id).then(response => {
							if(response.data.isOK == true && response.data.state == 200) {
								this.loading = false;
								this.pages = 1;
								this.comList();
								this.$message({
									message: "删除成功",
									type: "success"
								});
							} else {
								this.loading = false;
								this.$message.error("删除失败");
							}
						});
					})
					.catch(() => {
						this.$message({
							type: "info",
							message: "已取消删除"
						});
					});
			},
			fnChange() {
				if(this.form.checked) {
					this.isShow = false;
					this.form.min = "";
					this.form.max = "";
				} else {
					this.isShow = true;
				}
			}
		}
	};
</script>
<style scoped>
	.content .select {
		width: 100%;
		margin-bottom: 10px;
	}
	
	.content .select label {
		display: inline-block;
		width: 80px;
		line-height: 40px;
	}
	
	.title {
		width: 100%;
		box-sizing: border-box;
		margin-bottom: 10px;
	}
	
	.adduserinfo {
		width: 100%;
	}
	
	.adduserinfo .el-input {
		width: 90% !important;
	}
	
	.adduserinfo .el-cascader {
		width: 90% !important;
	}
	
	.adduserinfo .el-select {
		width: 90% !important;
	}
</style>